<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.14/vue.common.dev.js"></script>
  <script src="http://api.tianditu.gov.cn/api?v=4.0&tk=ae735d13cbec178839eb32925ca76e7c" type="text/javascript"></script>
  <link href="__CDN__/assets/szxc/style/index.css" rel="stylesheet" />
  <link href="__CDN__/assets/szxc/style/home.less" rel="stylesheet" />
  <!-- 引入样式 -->
  <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
  <!-- 引入组件库 -->
  <script src="https://unpkg.com/element-ui/lib/index.js"></script>
</head>
<style>
.platform {
  width: 100%;
  height: 100%;
  background: #3c5190;
}
.platform .header {
  position: relative;
  width: 100%;
  height: 60px;
  background: #010d31;
  text-align: center;
  line-height: 60px;
  color: #fff;
  font-size: 28px;
}
.platform .header span {
  position: absolute;
  right: 50px;
  color: #fff;
  cursor: pointer;
  font-size: 16px;
}
.platform .main {
  position: relative;
  width: 100%;
  height: calc(100% - 60px);
}
.platform .main .main-left {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 500;
  width: 200px;
  height: 100%;
  background: rgba(1, 13, 49, 0.5);
}
.platform .main .main-left span {
  color: #fff;
  padding: 30px 0 20px 10px;
}
.platform .main .main-left ul {
  padding-left: 40px;
  color: #fff;
}
.platform .main .main-right {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.platform .main .main-right ul {
  position: absolute;
  right: 20px;
  top: 30px;
  height: 60px;
  display: flex;
  z-index: 500;
}
.platform .main .main-right ul li {
  height: 50px;
  width: 60px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: rgba(19, 41, 94, 0.8);
  margin-right: 20px;
  border-radius: 5px;
}
.platform .main .main-right ul li i {
  font-size: 20px;
  color: #fff;
}
.platform .main .main-right ul li a {
  color: #fff !important;
  font-size: 13px;
}

</style>
<body>
  <div id="app">
    <div class="platform">
      <div class="header">
        <strong>固始县农业一张图农业数据展示平台</strong>
        <span @click="getMonitorList"><i class="el-icon-arrow-left"></i>返回</span>
      </div>
      <div class="main">
        <div class="main-left">
          <span>行政区域</span>
          <ul>
            <li>蓼城街道</li>
            <li>番城街道</li>
            <li>秀水街道</li>
            <li>黎集镇</li>
            <li>蒋集镇</li>
            <li>往流镇</li>
            <li>蓼城街道</li>
            <li>郭陆滩镇</li>
            <li>胡族铺镇</li>
            <li>方集镇</li>
            <li>三河尖镇</li>
            <li>段集镇</li>
            <li>汪棚镇</li>
            <li>张广庙镇</li>
            <li>陈集镇</li>
            <li>武庙集镇</li>
            <li>分水亭镇</li>
            <li>石佛店镇</li>
            <li>泉河铺镇</li>
            <li>祖师庙镇</li>
            <li>李店镇</li>
            <li>沙河铺镇</li>
            <li>洪埠乡</li>
            <li>杨集乡</li>
            <li>马堽集乡</li>
            <li>草庙集乡</li>
            <li>南大桥乡</li>
            <li>赵岗乡</li>
            <li>张老埠乡</li>
            <li>徐集乡</li>
            <li>丰港乡</li>
            <li>柳树店乡</li>
            <li>观堂乡</li>
          </ul>
        </div>
        <div class="main-right">
          <div id="mapDiv" style="width: 100%; height: 100%"></div>
          <ul>
            <li v-for="(item, index) in list" :key="index">
              <svg v-show="index == 0" t="1632314271567" class="icon" viewBox="0 0 1024 1024" version="1.1"
                xmlns="http://www.w3.org/2000/svg" p-id="2755" width="200" height="200">
                <path d="M854.016 451.328h30.464L797.696 220.16l-86.784 231.168h30.592l-30.592 81.28h30.592l-30.592 81.408h69.632v196.864H148.352v68.48h718.976v-68.48h-52.48V614.016h69.632l-30.464-81.408h30.464z"  p-id="2756" fill="#ffffff"></path>
                <path d="M185.344 789.632h461.696V515.84h40.192c13.312 0 20.096-16 10.752-25.6L428.8 216.192a17.536 17.536 0 0 0-25.088 0L134.528 490.24c-9.344 9.472-2.56 25.6 10.752 25.6h40.192v273.792zM430.208 515.84h92.672v92.672h-92.672V515.84z m0 121.216h92.672v92.672h-92.672v-92.672zM276.992 515.84h92.672v92.672h-92.672V515.84z m0 121.216h92.672v92.672h-92.672v-92.672z" p-id="2757" fill="#ffffff"></path>
              </svg>

              <svg v-show="index == 1" t="1632314418471" class="icon" viewBox="0 0 1024 1024" version="1.1"
                xmlns="http://www.w3.org/2000/svg" p-id="3614" width="200" height="200">
                <path
                  d="M512.1 679.8c-148.8 0-298.5-16.3-386.1-134.9-17.2-23.3-24.4-53.3-19.6-82.2 15.9-95.9 65.1-183.8 138.6-247.3 36.5-31.5 77.6-56.2 122.3-73.2 46.3-17.6 95-26.6 144.9-26.6s98.6 8.9 144.9 26.6c44.7 17 85.8 41.6 122.3 73.2 73.5 63.5 122.7 151.4 138.6 247.3 4.8 28.9-2.3 58.9-19.6 82.2-87.8 118.6-237.5 134.9-386.3 134.9z m0-524.2C330 155.6 176 287.5 145.9 469.2c-3 18.3 1.4 37.2 12.3 51.9 77.1 104.3 215.7 118.7 354 118.7s276.9-14.4 354-118.7c10.8-14.7 15.3-33.6 12.3-51.9-30.3-181.7-184.3-313.6-366.4-313.6z"
                  fill="#ffffff" p-id="3615"></path>
                <path
                  d="M557.6 945.9h-93.9c-22 0-42.6-8.9-56.7-24.5-13.3-14.7-19.6-33.6-17.7-53.2l17.1-175.3c2.9-29.8 33.1-53.1 68.7-53.1h71.1c35.6 0 65.8 23.3 68.7 53.1L632 868.2c1.9 19.6-4.4 38.5-17.7 53.2-14.1 15.6-34.7 24.5-56.7 24.5z m-82.5-266.1c-15.6 0-28.2 9-28.9 17l-17.1 175.3c-0.8 8.2 1.9 16.2 7.5 22.5 6.5 7.2 16.4 11.3 27.1 11.3h93.9c10.7 0 20.6-4.1 27.1-11.3 5.7-6.3 8.4-14.2 7.5-22.5l-17.1-175.3c-0.8-8-13.3-17-28.9-17h-71.1zM355.9 419.1c-38.9 0-76.8-13.6-106.8-38.2-29.6-24.3-50.1-58.2-57.9-95.5l-1.9-9.3 5.9-7.4c64.6-80.2 155.5-133 256-148.6l9.3-1.4 7 6.3c36 31.9 56.6 77.8 56.6 125.9 0 92.7-75.4 168.2-168.2 168.2zM232.6 286.3c15.6 54.3 66 92.8 123.3 92.8 70.7 0 128.3-57.5 128.3-128.3 0-33.5-13.2-65.7-36.4-89.5-83.7 15.3-159.5 59.3-215.2 125zM657.3 581.6c-57.3 0-103.9-46.6-103.9-103.9S600 373.8 657.3 373.8s103.9 46.6 103.9 103.9-46.6 103.9-103.9 103.9z m0-167.8c-35.2 0-63.9 28.6-63.9 63.9s28.6 63.9 63.9 63.9 63.9-28.6 63.9-63.9-28.7-63.9-63.9-63.9z"
                  fill="#ffffff" p-id="3616"></path>
              </svg>

              <svg v-show="index == 2" t="1632314504456" class="icon" viewBox="0 0 1024 1024" version="1.1"
                xmlns="http://www.w3.org/2000/svg" p-id="3812" width="200" height="200">
                <path
                  d="M833.496713 595.904968c47.5162-41.196261 70.373791-93.935416 67.537186-156.958798-1.541099-34.152844-11.574616-66.175165-31.483038-94.096075-3.696182-5.189186-14.222933-5.502317-21.595854-8.067746-0.971118 7.659447-2.577708 15.312754-2.606361 22.972201-0.00921 3.14155 3.442402 6.260587 5.216815 9.449209 40.820708 73.255421 22.839171 161.477718-44.901653 210.906477-17.680684 12.901845-20.736277 22.934339-11.33107 43.089377 32.334429 69.255317 12.531408 148.480706-46.3834 195.104583-59.423391 47.03013-139.850142 48.244794-200.636576 1.27504-15.164375-11.714809-24.296359-12.130272-38.8314 1.155313-57.986669 53.023634-138.179083 58.734706-201.855334 16.197914-62.938448-42.045605-88.007403-119.145587-61.194734-192.995549 6.55223-18.037818 3.119037-27.275203-13.395078-37.016055-66.397223-39.176254-95.450932-114.127294-73.963549-186.563046 21.164019-71.361281 85.661985-119.02586 161.558559-115.927289 23.63735 0.967024 32.518624-5.581112 38.619576-28.457122 17.115819-64.212464 60.128449-104.167454 125.392872-116.913756 66.415642-12.979616 120.962979 9.953699 161.79085 63.088874 11.254322 14.648628 16.035208 34.122145 25.907043 50.072419 3.953032 6.387477 13.625322 9.233292 20.694321 13.697977 2.38021-7.55814 6.788613-15.166421 6.581905-22.647813-0.205685-7.586792-4.551666-15.233959-7.78736-22.543436-50.316989-113.671922-193.983039-150.333914-293.027823-75.083046-36.261878 27.545356-58.153468 64.48364-70.924329 106.878193-3.374864 0.599657-5.495154 1.228991-7.637957 1.318018-92.88755 3.853771-162.354692 53.29174-188.115402 133.927245-26.015513 81.432661 1.019213 161.123654 75.148537 217.820957 9.989515 7.642051 9.045003 13.9712 6.339382 23.851221-22.318308 81.523735 8.216125 164.909887 76.985372 211.542974 69.083401 46.855144 157.181879 44.578288 224.899166-6.832615 10.280134-7.801686 16.696264-8.928347 28.190039-1.76725 72.695672 45.327348 159.974481 40.258912 224.736461-11.811 64.298422-51.704592 87.654362-136.071072 58.992579-217.214137C822.051033 611.008968 823.280024 604.76373 833.496713 595.904968z"
                  p-id="3813" fill="#ffffff"></path>
                <path
                  d="M511.706823 399.335011c-62.301951-0.025583-110.838388 48.436152-110.880343 110.709451-0.041956 62.290695 48.440246 110.858854 110.718661 110.914112 62.111616 0.058328 110.897739-48.65514 110.937648-110.753453C622.521674 447.950242 573.967842 399.360594 511.706823 399.335011zM510.205633 591.994915c-44.917002-1.12973-81.856309-39.675628-80.366376-83.85585 1.499144-44.384883 38.233789-80.080873 82.153068-79.833233 44.792159 0.24764 82.152045 38.178531 81.492012 82.72612C592.814072 555.868113 554.516838 593.110319 510.205633 591.994915z"
                  p-id="3814" fill="#ffffff"></path>
                <path
                  d="M511.992325 428.305833c-43.919279-0.251733-80.652901 35.44835-82.153068 79.833233-1.490957 44.180222 35.449373 82.72305 80.366376 83.851757 44.311205 1.119497 82.609463-36.122709 83.278705-80.962963C594.14437 466.484364 556.783461 428.553473 511.992325 428.305833z"
                  p-id="3815" fill="#ffffff"></path>
                <path
                  d="M801.79878 287.97576c-8.712429-7.009647-14.387685-14.857383-18.524912-14.115486-5.951549 1.064238-10.788717 8.377808-16.09763 13.025665 4.683672 4.552689 8.976442 12.103666 14.176884 12.789281C786.316158 300.331159 792.221658 293.830095 801.79878 287.97576z"
                  p-id="3816" fill="#ffffff"></path>
                <path
                  d="M833.496713 595.904968c47.5162-41.196261 70.373791-93.935416 67.537186-156.958798-1.541099-34.152844-11.574616-66.175165-31.483038-94.096075-3.696182-5.189186-14.222933-5.502317-21.595854-8.067746-0.971118 7.659447-2.577708 15.312754-2.606361 22.972201-0.00921 3.14155 3.442402 6.260587 5.216815 9.449209 40.820708 73.255421 22.839171 161.477718-44.901653 210.906477-17.680684 12.901845-20.736277 22.934339-11.33107 43.089377 32.334429 69.255317 12.531408 148.480706-46.3834 195.104583-59.423391 47.03013-139.850142 48.244794-200.636576 1.27504-15.164375-11.714809-24.296359-12.130272-38.8314 1.155313-57.986669 53.023634-138.179083 58.734706-201.855334 16.197914-62.938448-42.045605-88.007403-119.145587-61.194734-192.995549 6.55223-18.037818 3.119037-27.275203-13.395078-37.016055-66.397223-39.176254-95.450932-114.127294-73.963549-186.563046 21.164019-71.361281 85.661985-119.02586 161.558559-115.927289 23.63735 0.967024 32.518624-5.581112 38.619576-28.457122 17.115819-64.212464 60.128449-104.167454 125.392872-116.913756 66.415642-12.979616 120.962979 9.953699 161.79085 63.088874 11.254322 14.648628 16.035208 34.122145 25.907043 50.072419 3.953032 6.387477 13.625322 9.233292 20.694321 13.697977 2.38021-7.55814 6.788613-15.166421 6.581905-22.647813-0.205685-7.586792-4.551666-15.233959-7.78736-22.543436-50.316989-113.671922-193.983039-150.333914-293.027823-75.083046-36.261878 27.545356-58.153468 64.48364-70.924329 106.878193-3.374864 0.599657-5.495154 1.228991-7.637957 1.318018-92.88755 3.853771-162.354692 53.29174-188.115402 133.927245-26.015513 81.432661 1.019213 161.123654 75.148537 217.820957 9.989515 7.642051 9.045003 13.9712 6.339382 23.851221-22.318308 81.523735 8.216125 164.909887 76.985372 211.542974 69.083401 46.855144 157.181879 44.578288 224.899166-6.832615 10.280134-7.801686 16.696264-8.928347 28.190039-1.76725 72.695672 45.327348 159.974481 40.258912 224.736461-11.811 64.298422-51.704592 87.654362-136.071072 58.992579-217.214137C822.051033 611.008968 823.280024 604.76373 833.496713 595.904968z"
                  p-id="3817" fill="#ffffff"></path>
                <path
                  d="M511.706823 399.335011c-62.301951-0.025583-110.838388 48.436152-110.880343 110.709451-0.041956 62.290695 48.440246 110.858854 110.718661 110.914112 62.111616 0.058328 110.897739-48.65514 110.937648-110.753453C622.521674 447.950242 573.967842 399.360594 511.706823 399.335011zM510.205633 591.994915c-44.917002-1.12973-81.856309-39.675628-80.366376-83.85585 1.499144-44.384883 38.233789-80.080873 82.153068-79.833233 44.792159 0.24764 82.152045 38.178531 81.492012 82.72612C592.814072 555.868113 554.516838 593.110319 510.205633 591.994915z"
                  p-id="3818" fill="#ffffff"></path>
                <path
                  d="M801.79878 287.97576c-9.577123 5.854335-15.482623 12.355399-20.445658 11.69946-5.199419-0.684592-9.492188-8.239662-14.176884-12.789281 5.308913-4.647857 10.146081-11.961426 16.09763-13.025665C787.412119 273.119401 793.086351 280.967136 801.79878 287.97576z"
                  p-id="3819" fill="#ffffff"></path>
              </svg>

              <svg v-show="index == 3" t="1632314639430" class="icon" viewBox="0 0 1024 1024" version="1.1"
                xmlns="http://www.w3.org/2000/svg" p-id="4036" width="200" height="200">
                <path
                  d="M1024 462.08c0-46.08-11.52-90.88-34.56-131.84 8.96-21.76 14.08-46.08 14.08-69.12C1003.52 160 920.32 76.8 819.2 76.8c-25.6 0-51.2 5.12-74.24 15.36-30.72-25.6-70.4-40.96-111.36-40.96-17.92 0-34.56 2.56-49.92 7.68C542.72 20.48 490.24 0 435.2 0c-70.4 0-133.12 33.28-172.8 85.76-19.2-6.4-38.4-8.96-57.6-8.96C103.68 76.8 21.76 160 21.76 261.12c0 23.04 3.84 46.08 14.08 69.12C11.52 371.2 0 414.72 0 462.08 0 601.6 107.52 716.8 243.2 729.6v179.2c0 14.08 11.52 25.6 25.6 25.6s25.6-11.52 25.6-25.6V729.6c12.8-1.28 24.32-2.56 35.84-5.12 44.8 30.72 98.56 51.2 156.16 55.04V998.4c0 14.08 11.52 25.6 25.6 25.6s25.6-11.52 25.6-25.6V779.52c57.6-3.84 110.08-23.04 156.16-56.32 10.24 2.56 23.04 3.84 35.84 5.12v179.2c0 14.08 11.52 25.6 25.6 25.6s25.6-11.52 25.6-25.6V729.6c135.68-12.8 243.2-128 243.2-267.52z m-972.8 0c0-40.96 11.52-80.64 34.56-116.48 5.12-7.68 5.12-16.64 1.28-24.32-8.96-20.48-14.08-39.68-14.08-58.88C72.96 188.16 131.84 128 204.8 128c10.24 0 20.48 1.28 30.72 3.84-11.52 25.6-17.92 55.04-17.92 85.76 0 28.16 6.4 57.6 16.64 84.48-28.16 47.36-42.24 102.4-42.24 158.72 0 84.48 33.28 161.28 87.04 218.88H268.8c-120.32 0-217.6-97.28-217.6-217.6z m486.4 116.48l87.04-88.32c10.24-10.24 10.24-26.88 0-35.84-10.24-10.24-26.88-10.24-35.84 0l-51.2 51.2V448c0-14.08-11.52-25.6-25.6-25.6s-25.6 11.52-25.6 25.6v157.44l-62.72-62.72c-10.24-10.24-25.6-10.24-35.84 0-10.24 10.24-10.24 25.6 0 35.84l98.56 98.56v51.2c-135.68-12.8-243.2-128-243.2-267.52 0-51.2 15.36-102.4 42.24-143.36 5.12-7.68 5.12-17.92 1.28-25.6C275.2 268.8 268.8 243.2 268.8 217.6c0-92.16 74.24-166.4 166.4-166.4 46.08 0 90.88 19.2 122.88 55.04 7.68 7.68 19.2 10.24 29.44 6.4 14.08-7.68 29.44-10.24 46.08-10.24 33.28 0 65.28 14.08 87.04 37.12l3.84 3.84c19.2 23.04 29.44 51.2 29.44 80.64 0 23.04-6.4 44.8-17.92 62.72-5.12 8.96-5.12 19.2 0 28.16C765.44 358.4 780.8 409.6 780.8 460.8c0 84.48-39.68 165.12-107.52 215.04-39.68 29.44-85.76 47.36-135.68 52.48V578.56z m217.6 101.12h-10.24C800 620.8 832 542.72 832 460.8c0-56.32-15.36-111.36-43.52-160 11.52-23.04 17.92-48.64 17.92-76.8 0-32-8.96-62.72-25.6-90.88 11.52-3.84 25.6-5.12 38.4-5.12 72.96 0 133.12 60.16 133.12 133.12 0 20.48-5.12 40.96-14.08 58.88-3.84 7.68-3.84 16.64 1.28 24.32 21.76 37.12 33.28 76.8 33.28 117.76 0 120.32-97.28 217.6-217.6 217.6z"
                  fill="#ffffff" p-id="4037"></path>
              </svg>

              <svg v-show="index == 4" t="1632314712819" class="icon" viewBox="0 0 1024 1024" version="1.1"
                xmlns="http://www.w3.org/2000/svg" p-id="5722" width="200" height="200">
                <path
                  d="M695.7 842.1c-2 0-4.1 0-6.2-0.1-47.5-2-89.1-32-120.6-86.8-15-26.2-24.3-51.9-28.9-66.9-30 3.1-102.6 5.4-151.8-36.9-52.6-45.3-62-114.1-63.6-141.8-14-4.1-38.9-12.5-64.2-27.4-51.6-30.4-79.8-73-81.8-123-1.7-43.4 18.4-79.7 58-104.7 17.2-10.9 34.5-17.3 45.9-20.8-0.2-7.9 0.2-18.6 2.5-29.8 6.5-32.1 24.8-53.8 52.9-63 42.1-13.7 73.5 0.7 92.5 15.1 8.4 6.4 15.1 13.4 20.1 19.4 13.1-11 35.5-27.7 63.6-41.4 61.6-29.9 121.5-31 173.5-3.1 59.1 31.8 90.8 85.3 91.7 154.8 0.4 30.5-5.3 57.5-10 74.8 14.7 1.6 35.6 5.3 57.3 14.1 37.6 15.2 85 48.8 97.1 122.1 9.7 58.6-7.1 112.9-48.5 157-21.9 23.4-45.2 38-57.3 44.7-1.6 22.3-9.1 79.4-46.1 114.7-20.1 19.2-45.7 29-76.1 29zM562.2 654.3l3.3 13.8c0.3 1.4 35.1 140 125.3 143.8 24.9 1.1 44.6-5.7 60.3-20.7 18.8-18 27.9-44.7 32.3-64 4.8-21.5 4.9-38.2 4.9-38.4v-9.6l8.7-4c0.3-0.1 30.2-14.2 56.9-43 34.8-37.4 48.3-81.5 40.1-130.9-7.9-47.5-34.1-80.8-77.9-98.8-34-14-66.5-13.4-66.8-13.4l-22.7 0.6 8.4-21.1c0.1-0.4 15-38.3 14.2-83.6-1-58.3-26.5-101.3-75.9-127.9-43.7-23.5-92.9-22.3-146.1 3.6-40.9 19.9-68.4 47.1-68.6 47.3l-14.1 14-9.6-17.4c-0.1-0.1-8.2-14.3-23.4-25.6-19.2-14.2-40.8-17.5-64.3-9.9-17.5 5.7-28.1 18.7-32.6 39.7-3.7 17.4-1.3 33.5-1.3 33.6l2.1 14.2-14.1 2.8c-0.2 0-25.3 5.2-49.3 20.5-30 19.3-44.6 45.4-43.4 77.8 1.5 39.9 24.1 73 67 98.3 33.4 19.7 66.4 26.9 66.7 26.9l12.2 2.6-0.3 12.5c0 0.8-1.3 83.2 53.5 130.3 51 43.9 139.5 28.4 140.4 28.3l14.1-2.3z"
                  p-id="5723" fill="#ffffff"></path>
                <path
                  d="M673.7 611.8l-5.5-29.5c0.1 0 13-2.6 24.5-9.9 17-10.9 17.1-23.5 15.7-32-2.6-15.5-12.4-26.1-30.1-32.4-14.2-5.1-27.9-5.2-28.3-5.2l-21.9 0.2 7.8-20.5c0-0.1 5.1-13.7 5.2-29.9 0.2-19.5-6.4-33.3-20-42.1-31-20.2-78.2 26.7-78.7 27.2l-21.5-21c2.6-2.7 64.6-65.2 116.6-31.4 22.5 14.7 34.2 38.4 33.6 68.6-0.1 7.7-1.1 14.8-2.2 20.8 5.9 1 12.7 2.6 19.6 5.1 28 10.1 45.1 29.3 49.5 55.7 4.3 25.7-6.3 48-29.9 62.7-16.1 10-32.6 13.3-34.4 13.6zM255.6 941L96.2 781.5l10.6-10.6c76.1-76.2 112.2-153.9 129-205.7 18.3-56.2 18.6-94.9 18.6-95.3h30c0 1.7-0.1 42.8-19.6 103.2-11.3 35.2-27 69.9-46.5 103-21.9 37.2-48.7 72.6-79.9 105.3L255 897.9c15.4-15.1 46.2-43.4 88.4-71.9 35.8-24.1 72.3-43.3 108.7-57.1 45.6-17.3 91-26 134.9-26h0.6l-0.1 30h-0.6c-40.3 0-82.1 8.1-124.3 24.1-34.2 13-68.7 31.1-102.5 53.9-57.8 38.9-93.6 78.1-94 78.5L255.6 941z"
                  p-id="5724" fill="#ffffff"></path>
                <path
                  d="M258.3 670.1l17.7-41c10.9-25.4 39.4-98.8 39.4-133.5h30c0 20.6-7.1 51.4-21.2 91.7-2.1 5.9-4.1 11.6-6.1 16.9 34.3-14.6 55.6-16.6 56.8-16.7l2.5 29.9-1.3-14.9 1.3 14.9c-0.3 0-32.1 3.3-80.4 30.7l-38.7 22z"
                  p-id="5725" fill="#ffffff"></path>
              </svg>

              <svg v-show="index == 5" t="1632314787966" class="icon" viewBox="0 0 1024 1024" version="1.1"
                xmlns="http://www.w3.org/2000/svg" p-id="9002" width="200" height="200">
                <path
                  d="M800.76 59.87c-48.863 51.336-229.688 111.113-318.744 148.033-81.319 33.71-314.521 155.955-307.536 391.137 6.985 235.188 134.198 283.384 114.422 363.374 0 0 41.923-22.849 90.735-47.754 162.794-83.07 218.737-51.024 323.402-140.877 105.273-90.371 215.207-194.595 97.72-713.912z m-20.94 522.904c-44.204 155.192-184.9 189.965-284.496 223.765-43.35 14.712-85.774 37.392-117.865 56.765 4.872-56.208 42.518-129.19 130.145-156.375 84.304-26.16 133.616-76.366 147.045-91.515-27.557 24.662-171.407 64.829-188.923 58.09-18.617-7.165-8.8-92.556 58.159-102.674 97.77-14.766 163.52-81.625 163.52-81.625s-176.31 72.078-163.52 36.257c25.391-71.045 147.23-194.904 147.23-194.904-90.736 29.843-253.083 270.12-272.859 288.027-19.78 17.91-30.912-137.593-47.894-169.93-32.095-61.122 18.808 221.264 17.644 274.985-0.873 40.353-34.562 118.427-51.274 154.787-13.596-33.51-52.601-45.871-83.666-176.272C162.496 405.93 387.782 308.19 521.564 253.27 655.34 198.356 770.51 143.436 770.51 143.436s53.515 284.135 9.31 439.338z m-121.406 28.204s-1.259 1.609-3.766 4.436c1.725-1.543 3.012-3.029 3.766-4.436z"
                  p-id="9003" fill="#ffffff"></path>
              </svg>

              <svg v-show="index == 6" t="1632314836817" class="icon" viewBox="0 0 1024 1024" version="1.1"
                xmlns="http://www.w3.org/2000/svg" p-id="9956" width="200" height="200">
                <path
                  d="M879.665731 144.966673c-107.327424-107.327424-281.937231-107.327424-389.264655 0L324.875159 310.49259l-38.772049-38.765909c-12.196787-12.196787-31.974225-12.196787-44.150546 0-12.196787 12.196787-12.196787 31.963992 0 44.150546l38.772049 38.765909L145.286967 490.080781c-107.327424 107.317191-107.327424 281.947464 0 389.264655 53.6632 53.6632 124.148531 80.495312 194.632839 80.495312s140.968615-26.832112 194.632839-80.495312L669.991314 743.905744l35.592636 35.592636c6.097882 6.097882 14.086833 9.147334 22.075785 9.147334 7.988951 0 15.97688-3.049452 22.075785-9.147334 12.196787-12.186554 12.196787-31.963992 0-44.150546l-35.592636-35.592636 165.523871-165.523871C986.993155 426.914136 986.993155 252.283864 879.665731 144.966673zM654.78703 670.809959c-2.889817 1.458211-5.65479 3.25616-8.069793 5.671163-2.416026 2.413979-4.214998 5.179976-5.674233 8.072863l-150.640905 150.641929c-82.975806 82.975806-217.98878 82.975806-300.963563 0s-82.975806-217.98878 0-300.963563l345.114109-345.114109c41.487903-41.487903 95.985098-62.231343 150.482293-62.231343s108.99439 20.74344 150.482293 62.231343c82.975806 82.975806 82.975806 217.98878 0 300.963563L654.78703 670.809959z"
                  p-id="9957" fill="#ffffff"></path>
                <path
                  d="M414.266072 399.87941c-12.196787-12.196787-31.954783-12.196787-44.150546 0-12.196787 12.186554-12.196787 31.963992 0 44.150546l207.316719 207.316719c6.097882 6.097882 14.086833 9.147334 22.075785 9.147334 7.988951 0 15.97688-3.049452 22.075785-9.147334 12.196787-12.186554 12.196787-31.963992 0-44.150546L414.266072 399.87941z"
                  p-id="9958" fill="#ffffff"></path>
                <path
                  d="M625.576755 287.053762c7.988951 0 15.97688-3.049452 22.075785-9.147334l22.847357-22.847357c12.196787-12.186554 12.196787-31.963992 0-44.150546-12.196787-12.196787-31.954783-12.196787-44.150546 0l-22.847357 22.847357c-12.196787 12.186554-12.196787 31.963992 0 44.150546C609.599875 284.004309 617.587803 287.053762 625.576755 287.053762z"
                  p-id="9959" fill="#ffffff"></path>
                <path
                  d="M778.711458 363.259374l-22.857591 22.847357c-12.196787 12.196787-12.196787 31.963992-0.010233 44.160779 6.097882 6.097882 14.097066 9.147334 22.084994 9.147334s15.97688-3.049452 22.075785-9.137101l22.857591-22.847357c12.196787-12.196787 12.196787-31.963992 0.010233-44.160779C810.67545 351.073844 790.907221 351.084077 778.711458 363.259374z"
                  p-id="9960" fill="#ffffff"></path>
                <path
                  d="M662.457734 419.21478c-0.230244 0.042979-23.586185 4.340865-38.121226-10.194176-14.132882-14.132882-10.122545-35.721573-9.824763-37.205367 3.711532-16.683984-6.690376-33.296337-23.378453-37.176714-16.791431-3.927449-33.583886 6.504134-37.503149 23.295566-4.833075 20.679995-4.675486 64.015989 26.550703 95.242178 31.075763 31.075763 74.512041 31.664164 95.285157 27.112498 16.695241-3.65832 27.137057-20.022009 23.687492-36.753065C695.714162 426.800549 679.242002 415.97704 662.457734 419.21478z"
                  p-id="9961" fill="#ffffff"></path>
              </svg>

              <svg v-show="index == 7" t="1632314856757" class="icon" viewBox="0 0 1024 1024" version="1.1"
                xmlns="http://www.w3.org/2000/svg" p-id="10963" width="200" height="200">
                <path
                  d="M522.24 777.28A375.04 375.04 0 0 0 836.8 599.04a485.44 485.44 0 0 0 33.6-384 69.12 69.12 0 0 0-91.52-45.44l-108.8 42.24a788.8 788.8 0 0 0-133.76-160 47.04 47.04 0 0 0-54.72 0 788.8 788.8 0 0 0-134.72 160l-108.16-42.88a69.12 69.12 0 0 0-92.48 45.44 485.44 485.44 0 0 0 33.6 384A373.44 373.44 0 0 0 508.8 776.64zM760.96 979.2a120.96 120.96 0 0 0 32-5.76c41.28-8.32 113.6-48 125.44-211.2a25.28 25.28 0 0 0-5.76-18.56 16 16 0 0 0-13.44-5.76c-55.36 0-211.2 22.72-252.48 91.52a77.44 77.44 0 0 0 0 80 135.36 135.36 0 0 0 114.24 69.76zM125.12 741.12a17.6 17.6 0 0 0-12.48 8.32 25.28 25.28 0 0 0-5.76 18.56c11.84 163.2 83.2 202.56 125.44 211.2a120.32 120.32 0 0 0 25.28 0 135.36 135.36 0 0 0 120.32-66.56 77.44 77.44 0 0 0 0-80c-45.12-68.8-200.64-91.52-252.8-91.52z"
                  p-id="10964" fill="#ffffff"></path>
              </svg>

              <svg v-show="index == 8" t="1632314892240" class="icon" viewBox="0 0 1024 1024" version="1.1"
                xmlns="http://www.w3.org/2000/svg" p-id="11337" width="200" height="200">
                <path
                  d="M736 476.8V640c0 89.6-70.4 160-160 160h-128c-89.6 0-160-70.4-160-160v-160H224c-19.2 0-32-12.8-32-32s12.8-32 32-32h64v-32-16C233.6 358.4 192 313.6 192 256c0-19.2 12.8-32 32-32s32 12.8 32 32c0 25.6 22.4 48 48 48h6.4C336 256 387.2 224 448 224h128c57.6 0 108.8 32 137.6 80 22.4-6.4 38.4-25.6 38.4-48 0-19.2 12.8-32 32-32s32 12.8 32 32c0 51.2-35.2 92.8-80 108.8v48h64c19.2 0 32 12.8 32 32s-12.8 32-32 32h-64zM672 512v-128c0-54.4-41.6-96-96-96h-128c-54.4 0-96 41.6-96 96v128c25.6-19.2 60.8-32 96-32h128c35.2 0 70.4 12.8 96 32z m-224 32c-54.4 0-96 41.6-96 96s41.6 96 96 96h128c54.4 0 96-41.6 96-96s-41.6-96-96-96h-128z m-32-96c-19.2 0-32-12.8-32-32s12.8-32 32-32 32 12.8 32 32-12.8 32-32 32z m192-3.2c-19.2 0-32-12.8-32-32s12.8-32 32-32 32 12.8 32 32-12.8 32-32 32z"
                  p-id="11338" fill="#ffffff"></path>
              </svg>

              <svg v-show="index == 9" t="1632314922002" class="icon" viewBox="0 0 1024 1024" version="1.1"
                xmlns="http://www.w3.org/2000/svg" p-id="12631" width="200" height="200">
                <path
                  d="M896.2 611.3c-32.9-32.9-82.9-50.3-144.4-50.3-2.6 0-5.2 0-7.8 0.1-1-20-4.4-40.8-10-62.1 67.5-20.7 130.2-97.4 133.1-100.8l8.8-10.9-9.9-9.9c-3.6-3.6-89.2-87.1-262.3-101.7-6.8-7.3-13.7-14.6-20.9-21.8-112.6-112.6-248.7-152.6-331.1-152.6-48.4 0-86.6 12.7-110.7 36.7-37.8 37.8-47 112.3-24.6 199.5 22.6 88.2 72.5 174.3 140.5 242.3 10.3 10.3 20.9 20.3 31.7 29.7 32.5 172.1 125.3 248.9 129.3 252.2l10.9 8.8 9.9-10c2.9-2.9 61.4-62.2 81.6-125.5 15 3.1 29.6 5.1 43.8 5.9-1.1 46.4 7 109.1 50.2 152.3 17.6 17.6 35 26.1 53.3 26.1 52.6 0 63.9-58.5 72.9-105.6 3.3-17.4 9.4-49.2 15.6-58.7 8.8-4.6 35.6-10 51.8-13.2 50.9-10.2 99-19.9 111.5-61.1 4.9-16.2 4.8-41.3-23.2-69.4zM833.1 390c-19.4 21.3-64.2 66.3-108.3 79.5-18.5-52.7-49.7-107.3-91.3-159.1 108.3 15.8 174.8 60.1 199.6 79.6zM170.3 167.3c16.2-16.2 45.1-24.6 81.4-24.6 58.3 0 135.6 21.7 209.7 67.6-0.2 0.5-0.3 0.9-0.4 1.4-0.6 2.2-54.7 212.3-252.4 238.9-70.2-117.9-79.7-241.9-38.3-283.3zM427 827.6c-21.7-22.2-71.9-82.1-99.4-186.2 53.2 40.2 109.4 69.8 162.8 85.9-13.3 40.5-46.5 81.3-63.4 100.3z m300.4-102.5C695.6 756.9 702.1 878 667.7 878c-6.4 0-14.2-4.2-24-14-38.4-38.4-41.4-103-36.3-148.7 1-8.7-5.5-16-14-16-0.4 0-0.8 0-1.2 0.1-5 0.4-10 0.6-15.2 0.6-84.1 0-195.4-54.1-290.6-149.3-22.7-22.6-42.4-46.7-59.4-71.4 182.7-32.9 248.3-209 261.5-251.1 22.5 16 44.4 34.3 65.1 55C654.7 384.3 709.4 503.5 702.3 589c-0.7 8.5 6 15.4 14.3 15.4 0.6 0 1.1 0 1.7-0.1 10.4-1.2 21.7-1.9 33.5-1.9 40.2 0 85.5 8.5 115.2 38.2 62.2 62.2-108.1 53-139.6 84.5z"
                  p-id="12632" fill="#ffffff"></path>
                <path
                  d="M258.787953 305.304517a39.9 39.9 0 1 0 56.426136-56.428106 39.9 39.9 0 1 0-56.426136 56.428106Z"
                  p-id="12633" fill="#ffffff"></path>
              </svg>
              <a>{{ item.name }}</a>
            </li>
          </ul>
        </div>

      </div>
    </div>
  </div>
  <script src="__CDN__/assets/szxc/utils/TMap.js"></script>
  <script type="module">
    import { xingxianData } from '/assets/szxc/utils/data.js'
    import { mapDate } from "/assets/szxc/utils/mapData.js"
    import { gushiData } from '/assets/szxc/utils/mapGsData.js'
    import { area } from '/assets/szxc/utils/area.js'
    import { dataProvince } from '/assets/szxc/utils/dataProvince.js'
    var app = new Vue({
      el: '#app',
      data() {
        return {
          jobBasicList: [],
          jobMonitorList: [],
          list: [
            { name: '数字乡村', path: '/platform/map' },
            { name: '数字菌园', path: '/digitization/culture' },
            { name: '数字田园', path: '' },
            { name: '数字果园', path: '' },
            { name: '数字菜园', path: '' },
            { name: '数字茶园', path: '' },
            { name: '数字药园', path: '' },
            { name: '数字花园', path: '' },
            { name: '数字牧场', path: '' },
            { name: '数字渔场', path: '' },
          ],
          jobBasicOptionMap: {
            '1': {
              zoom: 11,
              lng: 115.5446416630001,//'115.5446416630001,32.280331197000066'
              lat: 32.280331197000066,
              options: {
                color: "blue",
                fillColor: "#FFFFFF",
                fillOpacity: 0.5
              }
            },
            '2': {
              options: {
                color: "#0000FF",
                opacity: 0.5,
                weight: 10
              }
            },
            '3': {
              zoom: 11,
              lng: 115.5446416630001,
              lat: 32.280331197000066,
              options: {
                color: "#FFFF00",
                fillColor: '#0000FF',
                fillOpacity: 0.5
              }
            },
            '4': {
              zoom: 15,
              lng: 115.5446416630001,
              lat: 32.280331197000066,
              options: {
                color: "#FF0000",
                opacity: 1,
                lineStyle: 'dashed'
              }
            },
            '5': {
              options: {
                color: "#0000FF",
                opacity: 0.5,
                weight: 10
              }
            }
          },
          //图标映射
          jobIconMap: {
            project: {
              '1': 'reservoir',
              '2': 'dam',
              '3': 'sluice',
              '4': 'pump'
            },
            monitor: {
              '1': 'reservoir',
              '2': 'rain',
              '3': 'quality',
              '4': 'section',
              '5': 'power',
              '6': 'szxc'
            },
            video: {
              '1': 'hydrology',
              '2': 'protection',
              '3': 'djbasin'
            },
            public: {
              '1': 'public',
              '2': 'public2'
            }
          },
        }
      },
      computed: {
        dataProvince() {
          return dataProvince.map(item => item.join(','))
        }
      },
      created() {
        window.mapZoomChange = (type, target) => {
          return this.mapZoomChange(type, target);
        }
      },
      mounted() {
        this.initMap();
      },
      methods: {
        initMap() {
          this.tMap = new TMap("mapDiv", T);
          this.tMap.vm = this;
          this.tMap.addMapControl(["scale"]);//["mapType", "zoom", "scale"]
          this.getBasicList()
          this.areaShow()
          // 
          this.getMonitorList()
        },
        // 覆盖县以外的
        areaShow() {
          var that = this
          var point = dataProvince, point1 = mapDate.map(item => item.split(','))
          that.tMap.areaShow(point, point1)
        },
        //获取体贴放大缩小
        mapZoomChange(val) {
          return true
        },
        // 获取基础数据-- 添加地图边界
        getBasicList() {
          var that = this
          // 1.清除覆盖物
          if (that.tMap.jobBasicOverLays && that.tMap.jobBasicOverLays.length) {
            var overLays = that.tMap.jobBasicOverLays
            for (var i = 0; i < overLays.length; i++) {
              var overlay = overLays[i]
              that.tMap.removeOverLay(overlay)
            }
            delete that.tMap.jobBasicOverLays
          }
          let data = [
            {
              id: "6",
              lnglatList: mapDate,
              mark: "测试数据",
              moduleType: "basic",
              name: "测试数据",
              shoreType: "测试",
              type: "4",
            }
          ]
          gushiData.forEach(item => {
            data.push({
              id: "6",
              lnglatList: item.lnglatList,
              properties: item.properties,
              mark: "测试数据",
              moduleType: "basic",
              name: "测试数据",
              shoreType: "测试",
              type: "4",
            })
          })
          // return
          // 2.再重新添加的覆盖物
          that.jobBasicList = data;

          // 设置模块名称，用于区分窗口属性映射关系keyMap的设置
          that.tMap.topModuleType = 'job'
          that.tMap.moduleType = 'basic'

          for (var i = 0; i < that.jobBasicList.length; i++) {
            var item = that.jobBasicList[i]
            var type = item.type
            var lnglatList = item.lnglatList

            // 为标注点的属性添加模块的名称，用于弹窗获取映射中文属性名，修复切换顶级模块后（没有重新设置moduleType，导致模块名不对应），弹窗内容显示的问题
            item.moduleType = 'basic'

            // 构建坐标点列表
            var points = that.tMap.buildPoints(lnglatList)

            // 添加覆盖物并返回覆盖物
            var option = this.getOptionBytype(type)
            var method = this.getOverlayMethodBytype(type)
            var zoom = option && option.zoom ? option.zoom : that.tMap.zoom
            var lng = option && option.lng ? option.lng : that.tMap.lng
            var lat = option && option.lat ? option.lat : that.tMap.lat
            var options = option && option.options ? option.options : {}

            var overlay = that.tMap[method](points, item, options)

            that.tMap.centerAndZoom(lng, lat, zoom)

            // 将基础覆盖物保存起来
            if (!that.tMap.jobBasicOverLays) {
              that.tMap.jobBasicOverLays = []
            }

            that.tMap.jobBasicOverLays.push(overlay)

            // 将覆盖物保存起来
            if (type === '2') {
              if (!that.tMap.jobBasicTopRiverOverLays) {
                that.tMap.jobBasicTopRiverOverLays = []
              }
              that.tMap.jobBasicTopRiverOverLays.push(overlay)
            }
          }
          // 
        },

        // 打点 - 在地图中标记某个点
        // 获取监测站数据
        getMonitorList() {
          var that = this
          // 1.先清除现有的的覆盖物
          if (that.tMap.jobMonitorOverLays && that.tMap.jobMonitorOverLays.length) {
            var overLays = that.tMap.jobMonitorOverLays
            for (var i = 0; i < overLays.length; i++) {
              var overlay = overLays[i]
              that.tMap.removeOverLay(overlay)
            }
            delete that.tMap.jobMonitorOverLays
          }
          that.jobMonitorList = gushiData.filter((i, index) => index % 7 == 0).map(item => ({
            id: "5",
            lnglat: item.lnglatList[0],
            path: '/platform/map',
            moduleType: "monitor",
            targetWaterQuality: "5",
            type: "3",
          }))
          that.jobMonitorList.push({
            id: "5",
            lnglat: '115.5446416630001,32.280331197000066',
            path: '/digitization/terrace',
            moduleType: "monitor",
            targetWaterQuality: "5",
            type: "6",
          })
          // 设置模块名称，用于区分窗口属性映射关系keyMap的设置

          that.tMap.topModuleType = 'job'
          that.tMap.moduleType = 'monitor'
          for (var i = 0; i < that.jobMonitorList.length; i++) {
            var item = that.jobMonitorList[i]
            var lnglat = item.lnglat
            // 构建坐标点列表
            var point = that.tMap.buildPoint(lnglat)
            var iconUrl = that.getIconBytype(that.tMap.moduleType, item.type)

            // 为标注点的属性添加模块的名称，用于弹窗获取映射中文属性名，修复切换顶级模块后（没有重新设置moduleType，导致模块名不对应），弹窗内容显示的问题
            item.moduleType = 'monitor'

            // 添加覆盖物并返回覆盖物
            var overlay = that.tMap.addMarker(point, item, iconUrl)

            // 将水利基础覆盖物保存起来
            if (!that.tMap.jobMonitorOverLays) {
              that.tMap.jobMonitorOverLays = []
            }
            that.tMap.jobMonitorOverLays.push(overlay)
          }
        },
        // 根据类别获取图标
        getIconBytype(moduleType, type) {
          return this.jobIconMap[moduleType][type]
        },


        // 根据基础类别获取覆盖物样式
        getOptionBytype(type) {
          return this.jobBasicOptionMap[type]
        },
        // 根据基础类别获取覆盖物类型
        getOverlayMethodBytype(type) {
          if (type === '1' || type === '3') {
            return 'addPolygon'
          } else if (type === '2' || type === '4') {
            return 'addPolyline'
          }
        },
      }
    })
  </script>
</body>

</html>